<template>
    <!-- 产品详情-box -->
    <view class="good-info-box">
        <view class="g-i-a">
            <view>
                <text class="a-title">名称：</text>
                <text>{{ goodInfo.title }}</text>
            </view>
            <view>
                <text class="a-title">销价：</text>
                <text>{{ goodInfo.price }}</text>
            </view>
            <view>
                <text class="a-title">有效天数：</text>
				<text v-if="goodInfo.outday > 0">购买后 {{ goodInfo.outday }} 天内有效</text>
				<text v-else>永久有效</text>
            </view>
            <view class="flex-div">
                <text class="a-title">颜色：</text>
				<view class="setting-box"> <view :style="{'background': goodInfo.setting.color}"></view> </view>
            </view>
        </view>
        <view class="g-i-a">
            <view>
                <text class="a-title">类型：</text>
				<el-tag effect="plain" type="info" size="mini" >{{ typeText(goodInfo.type)  }}</el-tag>
            </view>
            <view class="flex-div" style="align-items: inherit;">
                <text class="a-title">服务商品：</text>
				<view class="serve-list">
					<view class="serve-list-item" v-for="(item,index) in  goodInfo.gd_ls">
						<text>{{item.title}}</text>
						<view class="serve-list-times">{{item.times}}</view>
						<text>次</text>
					</view>
				</view>
            </view>
            
        </view>
        <view class="g-i-a">
            <view>
				<view>
				    <text class="a-title">上架设置：</text>
					<text v-for="(item, index) in goodInfo.onsale_yds">{{ item.shopname}} {{index == goodInfo.onsale_yds.length-1?"":"，"}}</text>
				</view>
            </view>
            <view>
				<view>
				    <text class="a-title">开服客户：</text>
					<text> {{ onsaleIsoldText(goodInfo.onsale_isold) }}</text>
				</view>
            </view>
            <view>
                <view  >
                    <text class="a-title">客户类别：</text>
					<text v-if="goodInfo.onsale_typeid.length > 1" v-for="(item, index) in goodInfo.onsale_typeid">{{ item.title}} {{index == goodInfo.onsale_typeid.length-1?"":"，"}}</text>
                    <text v-if="!goodInfo.onsale_typeid">未设置</text>
					<!-- <text class="qty-m icon-font icon-style">&#xe600;</text> -->
                </view>
            </view>
        </view>
        <view class="g-i-a">
            <view>
                <view >
                    <text class="a-title">使用说明：</text>
                    <text class="qty-m icon-font icon-style">{{goodInfo.desc}}</text>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import accessCtrl from "../../js/limit/AccessCtrl.js";
import goodsTlpCtrl from "../../js/project/GoodsTlpCtrl.js";

export default {
    props: ["goodInfo", "qty", "tplinfo"],
    data() {
        return {
            isShowCost: false,
            ishasCoupons: false,
            ishasPricec: false,
        };
    },
    async created() {
        this.isShowCost = await accessCtrl.getGdsCostSeeLimit();
        this.initData();
    },
    methods: {
        getsaleDataFun(type) {
            this.$emit("getsaleDataFun", type);
        },
        filterPrice(type, data) {
            let arr = [];
            let min = "";
            let max = "";
            let pricedata = "";
            let result = "";
            if (type == 1) {
                if (data && data.length > 0) {
                    data.map((v) => {
                        if (v.pricec > 0) {
                            arr.push(v.pricec);
                        }
                    });
                }
            } else {
                if (data && data.length > 0) {
                    data.map((v) => {
                        if (v.priceinfo && v.priceinfo.length > 0) {
                            v.priceinfo.map((vs) => {
                                if (vs.money_q > 0) {
                                    arr.push(vs.money_q);
                                }
                            });
                        }
                    });
                }
            }
            arr = arr.sort((a, b) => {
                return a - b;
            });
            min = arr[0];
            max = arr[arr.length - 1];
            result = arr.every((item) => item === min);
            if (result) {
                //全部都一样
                pricedata = min;
            } else if (arr.length == 0) {
                // 全部为0
                pricedata = "";
            } else {
                pricedata = `${min}-${max}`;
            }
            return pricedata;
        },
        initData() {
            this.ishasCoupons = goodsTlpCtrl.hasCoupons();
            this.ishasPricec = goodsTlpCtrl.hasPricec();
        },
        onClickQty() {
            this.$emit("gdStoreWin");
        },
		typeText (type) {
		    if (type == 1) {
		        return "次卡"
		    } else if (type == 2) {
		        return "时卡"
		    } else if (type == 3) {
		        return "通卡"
		    }
		},
		onsaleIsoldText (type) {
			if (type == 0) {
			    return "不限"
			} else if (type == 1) {
			    return "新用户"
			} else if (type == 2) {
			    return "老用户"
			}
		}
    },
};
</script>

<style lang="scss" scoped>
// 产品详情-box
.good-info-box {
    padding-left: 20px;
    .g-i-a {
        border-bottom: 1px solid #eee;
        padding: 10px 0;
        color: #333;
        font-size: 14px;
        .a-title {
			width: 85px;
            color: #9fa0a8;
			display: inline-block;
		}
        .price {
            color: #f04848;
            &.scribing-price {
                text-decoration: line-through;
                color: #9fa0a8;
            }
            .b-z-price {
                font-size: 12px;
            }
        }
        .qty-m {
            color: #333;
            cursor: pointer;
        }
        // .qty-m:hover {
        //     color: #3388ff;
        // }
        .txt-h {
            cursor: pointer;
            &:hover {
                color: #3388ff;
                .qty-m {
                    color: #3388ff;
                }
            }
        }
    }
	.flex-div {
		display: flex;
		align-items: center;
	}
	.serve-list {
		width: 250px;
		.serve-list-item {
			width: 100%;
			display: flex;
			align-items: center;
			.serve-list-times {
				width: 60px;
				height: 30px;
				line-height: 30px;
				text-align: center;
				border-bottom: 1px solid #000000;
				margin: 0 10px;
			}
		}
	}
	.setting-box {
		width: 200px;
		height: 25px;
		// border: 1px solid #000;
		> view {
			width: 100%;
			height: 100%;
		}
	}
}
</style>
